*{
	margin: 0 ;
	padding: 0;
	box-sizing: border-box;
}
ul li{
	list-style: none;
}
.fl{
	float: left;
}
.fr{
	float: right;
}
.clear{
	clear: both;
}
.page{
	height: 100vh;
	padding: 20px;
	background: url(../img/beij.png)no-repeat center;
	background-size: cover;
}
.head{
	height: 5vh;
	display: flex;
}
.head-in{
	flex: 6;
	margin: 0 auto;
	display: flex;
}
.head-in-title p{
	font-size: 4vh;
	color: #3985D5;
}
.head-left{
	flex: 2;
	color: #1DC5EF;
	font-size: 1.2vw;
}
.icon-2{
	width: 25px;
	height: 25px;
	background: url(../img/4.png)no-repeat;
	background-size: cover;
	display: inline-block;
	vertical-align: middle;
}
.head-right{
	flex: 2;
	color: #ffffff;
}
.head-in-left{
	flex: 3;
}
.head-in-title{
	flex: 4;
}
.head-in-right{
	flex: 3;
}
.head-in-left img{
	width: 100%;
}
.head-in-title{
	text-align: center;
}
.head-in-right img{
	width: 100%;
}
/* .head-right p{
	float: left;
} */
.head-p{
	font-size:20px ;
}
.head-right1{
	width: 100px;
	text-align: right;
	margin-left: 80px;
	margin-top: -45px;
}
.head-right ul{
	float: left;
}
/* .icon-1{
	width: 30px;
	height: 30px;
	
	background: url(../img/3.png)no-repeat transparent;
	background-size: cover;
	display: inline-block;
} */
.Chart{
	display: flex;
	height: 87vh;
}
.Chart-left{
	flex: 3;
}
.Chart-in{
	padding: 0 20px;
	flex: 4;
}
.Chart-right{
	flex: 3;
}

#Chart-left1{
	position: relative;
	height: 23vh;
	border: 2px solid #07417A;
	box-shadow: inset 0 0 30px #07417a;
	
}

.Chart-left1-title{
	position: absolute;
	top: 15vh;
	left: 5vh;
	z-index: 999;
}
.Chart-left1-title1 span{
	color: #FFFFFF;
	font-size: 0.8vh;
}
.Chart-left1-title1 .span1{
	width: 20vh;
	padding: 0.5vh;
	background: #00D1F7;
	text-align: center;
}

.inp1{
	width: 15vh;
	border: none;
	outline: none;
}
.inp2{
	width: 15vh;
	border: none;
	outline: none;
}
.Chart-left1-title2 .icon-3{
	width: 3vh;
	margin-left: 10vh;
	height: 0.3vh;
	display: inline-block;
	background: #11B58E;
	vertical-align: middle;
}
.Chart-left1-title2 .icon-4{
	width: 3vh;
	margin-left: 10vh;
	height: 0.3vh;
	display: inline-block;
	background: #C23B67;
	vertical-align: middle;
}
.Chart-left1-title2 span{
	margin-left: 1vh;
	font-size: 0.9vh;
	color: #FFFFFF;
}
#Chart-left2{
	height: 20vh;
}
#Chart-left3{
	height: 25vh;
	border: 2px solid #07417A;
	box-shadow: inset 0 0 30px #07417a;
}
.box-title{
	width: 100%;
	margin: 10px 0;
	height: 4vh;
	line-height: 4vh;
	text-align: center;
}
.box-word{
	color: #1EC8F1;
	margin-left: 10px;
}
.box{
	margin: 5px 0 10px;
	width: 15px;
	height: 15px;
	border: 2px solid #2F98A3;
	transform: rotateZ(45deg);
}
#Chart-left2{
	padding: 5px;
	box-shadow: inset 0 0 30px #07417a;
}
table{
	margin-left: 2vh;
	color: #FFFFFF;
}
#Chart-left2 th{
	padding: 5px 0;
	font-size: 0.8vh;
	padding-left: 10px;
	padding-right: 50px;
	background: #042442;
	border-bottom: 1px solid #000A1E;
}
#Chart-left2 td{
	padding: 0.1vh 0;
	font-size: 0.6vh;
	padding-left: 10px;
	background: #011327;
	border-bottom: 1px solid #000A1E;
}
#Chart-in1{
	background-color: rgba(27, 142, 236, 1);
	height: 49.5vh;
	box-shadow: inset 0 0 30px #07417a;
}
.Chart-in2{
	height: 25vh;
	box-shadow: inset 0 0 30px #07417a;
}
.Chart-right{
	position: relative;
}
.Chart-right1{
	height: 49.5vh;
	box-shadow: inset 0 0 30px #07417a;
}
.Chart-right4{
	width: 100%;
	top: 33vh;
	position: absolute;
	height: 24vh;
}
.Chart-right2{
	height: 25vh;
	/* box-shadow: inset 0 0 30px #07417a; */
}
.Chart-right3{
	width: 50%;
	right: 5vh;
	position: absolute;
	height: 25vh;
	top: 63vh;
	/* box-shadow: inset 0 0 30px #07417a; */
}
.Chart-right1-title{
	position: absolute;
	top: 9vh;
	left: 8vh;
	color: #FFFFFF;
	font-size: 0.8vh;
	z-index: 999;
}
.Chart-right1-title input{
	width: 11vh;
	outline: none;
}
.Chart-right1-title .span1{
	width: 20vh;
	padding: 0.5vh;
	background: #00D1F7;
	text-align: center;
}
